<style lang="less">
@import "./src/less/config.less";
page {
  font-size: 0.8rem;
  background: @bg-color;
  color: #555;
}
.picker {
  padding: 0.5rem;
  display: flex;
  justify-content: space-between;
}
.table {
  padding: 0.5rem;
  .row {
    background: #efefef;
    box-shadow: 4rpx 4rpx 8rpx #ddd;
    &:nth-child(1) {
      background: #efefef;
    }
    margin-top: 0.5rem;
    display: flex;
    view {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0.2rem;
    }
    .item {
      padding: 0.2rem 0;
      color: #fffafa;
      border-radius: 0.1rem;
      view {
        padding: 0.3rem 0;
      }
    }
    .use {
      box-shadow: 4rpx 4rpx 4rpx #ccc;
      background: red;
    }
    .not-use {
      box-shadow: 4rpx 4rpx 4rpx #ccc;
      background: #008e59;
    }
  }
}
ad {
}
</style>

<template>
  <view class="classroom">
    <picker mode="multiSelector" range-key="name" @change="changeBuilding" @columnchange="columnchange" value="{{index}}" range="{{buildings}}">
      <view class="picker">
        <view>当前选择：{{building.addr}}-{{building.name}}</view>
        <view>
          点击切换
        </view>
      </view>
    </picker>
    <view class="table">
      <view class="thead row">
        <view>教室</view>
        <view>一大节</view>
        <view>二大节</view>
        <view>三大节</view>
        <view>四大节</view>
        <view>五大节</view>
      </view>
      <block wx:for="{{rooms}}" wx:key="{{index}}">
        <view class="row">
          <view class="room-name">{{item.roomName}}</view>
          <block wx:for="{{item.classUse}}" wx:for-item="val" wx:key="{{index}}">
            <view @tap="show({{item}},{{index}})" class="item">
              <view class="{{val.use == 0 ? 'not-use' : 'use'}}">{{val.kcm ? val.kcm[2] : '空'}}</view>
            </view>
          </block>
        </view>
      </block>
    </view>
    <ad wx:if="{{adShow}}" unit-id="adunit-95d3bc7778042638"></ad>
  </view>
</template>

<script>
import wepy from "wepy";
import HttpMixin from "../mixins/http";
import ToastMixin from "../mixins/toast";
import db from "../util/db";
import ADConfig from "util/ad";
export default class Classroom extends wepy.page {
  config = {
    navigationBarTitleText: "我要自习"
  };
  data = {
    JA: [
      {
        name: "一教A座",
        value: "yjA"
      },
      {
        name: "一教B座",
        value: "yjB"
      },
      {
        name: "一教C座",
        value: "yjC"
      },
      {
        name: "一教D座",
        value: "yjD"
      },
      {
        name: "综合楼B座",
        value: "zongB"
      },
      {
        name: "综合楼C座",
        value: "zongC"
      },
      {
        name: "文科楼一区",
        value: "wen1"
      },
      {
        name: "文科楼二区",
        value: "wen2"
      },
      {
        name: "文科楼三区",
        value: "wen3"
      }
    ],
    WJ: [
      {
        name: "东二教",
        value: "WJdong2"
      },
      {
        name: "东三教",
        value: "WJdong3"
      },
      {
        name: "基教楼A座",
        value: "WJjijiaoA"
      },
      {
        name: "基教楼C座",
        value: "WJjijiaoC"
      }
    ],
    HX: [
      {
        name: "九教",
        value: "HX9"
      },
      {
        name: "十教",
        value: "HX10"
      }
    ],
    building: {
      addr: "望江",
      name: "东二教",
      value: "WJdong2"
    },
    buildings: [
      [
        {
          name: "望江",
          value: "WJ"
        },
        {
          name: "江安",
          value: "JA"
        },
        {
          name: "华西",
          value: "HX"
        }
      ],
      [
        {
          name: "东二教",
          value: "WJdong2"
        },
        {
          name: "东三教",
          value: "WJdong3"
        },
        {
          name: "基教楼A座",
          value: "WJjijiaoA"
        },
        {
          name: "基教楼C座",
          value: "WJjijiaoC"
        }
      ]
    ],
    index: [0, 0],
    rooms: []
  };
  computed = {
    adShow() {
      return ADConfig.Get("classroom");
    }
  };
  mixins = [HttpMixin, ToastMixin];
  components = {};
  methods = {
    changeBuilding(e) {
      this.index = e.detail.value;
      this.building = this.buildings[1][this.index[1]];
      this.building.addr = this.buildings[0][this.index[0]].name;
      this.get(this.building.value);
    },
    columnchange(e) {
      if (e.detail.column !== 0) {
        return;
      }
      let building = this.buildings[0][e.detail.value].value;
      this.buildings[1] = this[building];
    },
    show(item, i) {
      wepy.showModal({
        title: this.building.name + item.roomName,
        content: `座位数: ${item.roomZws}, 第${i + 1}大节: ${item.classUse[i]
          .kcm || "空闲"}`,
        showCancel: false
      });
    }
  };
  async get(classroom) {
    const resp = await this.POST("/classroom", {
      classroom: classroom
    });
    this.rooms = JSON.parse(resp.data).roomdata;
    this.$apply();
    db.Set("classroom", this.building);
  }
  async onLoad() {
    this.building = db.Get("classroom") || this.building;
    // 获取教室
    this.get(this.building.value || "WJdong2");
  }
  onShareAppMessage(options) {
    return {
      title: "一起来自习"
    };
  }
}
</script>
